<template>
    <div id="regular">
        <div class="regular-c">
            <div class="list-conts" >
                <div class="left-content">
                    <div>
                        <span class="time">电瓶车充电优惠券</span>
                        <span class="place-title">查看规则详情> </span>
                    </div>
                    <div class="t-middle">
                        <span>有效期至 2019-10-30</span>
                    </div>
                    <div class="btn-cont">
                        仅限购买电瓶车充电月卡使用
                    </div>
                </div>
                <div class="right-content">
                    <div class="money"><span class="money-num">20</span>元</div>
                    <div class="money-detail"></div>
                </div>
            </div>
        </div>
        <div>
            <van-cell-group>
                <van-field
                        v-model="time"
                        rows="1"
                        autosize
                        disabled
                        label="有效时间"
                        type="textarea"
                />
                <van-field
                        v-model="discount"
                        rows="1"
                        autosize
                        disabled
                        label="6折券"
                        type="textarea"
                />
                <van-field
                        v-model="limit"
                        rows="1"
                        autosize
                        disabled
                        label="交易限制"
                        type="textarea"
                />
                <van-field
                        v-model="orderCount"
                        rows="1"
                        autosize
                        disabled
                        label="订单金额"
                        type="textarea"
                />
                <van-field
                        v-model="useRegular"
                        rows="1"
                        autosize
                        disabled
                        label="使用规则"
                        type="textarea"
                />
            </van-cell-group>
        </div>
    </div>
</template>

<script>

    export default {
        name: "regular",
        data() {
            return {
                time: '2019-09-30 00:00:00 至 2019-10-3 23:59:59',
                discount: '需支付订单金额60%',
                limit: '月卡',
                orderCount: '100元',
                useRegular: '满一元可用',
            }
        },
        mounted() {
            apiForgetPsd().then(data => {
                console.log(data, 4444)
            })
        },
        methods: {}
    }
</script>

<style scoped lang="scss">
    #regular {
        .regular-c {
            padding: 0 20px;
            padding-bottom: 30px;
        }
        .list-conts {
            margin-top: 16px;
            height: 90px;
            background: #fff;
            font-size: 12px;
            padding: 15px 0;
            vertical-align: top;
            border-bottom: 4px solid #3b80ed;
            .left-content {
                display: inline-block;
                width: 80%;
                font-size: 14px;
                .time {
                    padding: 20px;
                    padding-right: 10px;
                }
                .place-title {
                    padding: 20px 0;
                    font-size: 12px;
                    color: #b8bdc7;
                }
                .t-middle {
                    color: #b8bdc7;
                    span {
                        display: inline-block;
                        text-align: center;
                        padding: 0 20px;
                    }
                }
                .btn-cont {
                    padding: 40px 20px;
                    padding-bottom: 10px;
                    color: #b8bdc7;
                }
            }
            .right-content {
                display: inline-block;
                width: 20%;
                text-align: center;
                vertical-align: top;
                .money {
                    font-weight: 500;
                    font-size: 14px;
                    margin-bottom: 20px;
                    .money-num {
                        font-size: 30px;
                    }
                }
            }
        }
    }
</style>
